// @import url('https://js.arcgis.com/3.20/esri/css/esri.css')
@import 'nav'
@import 'arcgis'
@import 'dxTable'
@import 'dxAmap'

#app
  position: fixed
  top: 0
  bottom: 0
  left: 0
  right: 0
h1, h2, h3, h4, h5, h6
  font-weight: lighter
ul, ol, li, dl, dt, dd
  display: block
  list-style: none
  margin: 0
  padding: 0
.header
  padding: 0 12px
  background: #191d26
  color: #eee
  border-bottom: 0
  a
    color: #eee
    &:hover
      color: #fff
.header-logo, .toggle-sidebar
  color: #eee
.page-sidebar
  position: relative
@media (max-width: 991px)
  .header
    background: #191d26!important
.book-item
  margin-top: 6px
  border-radius: 5px
  background: transparent
  .book-item-box
    cursor: move
    line-height: 24px
    color: #fff
    font-size: 12px
    text-align: center
    border-radius: 5px
    background: #48b0f7

// START 地图初始化
.amap-logo
  display: none !important
.amap-copyright
  display: none !important
// START 地图初始化

// START 图标
.iconfont
  display: inline-block
.icon-loading
  animation: rotating 1s linear infinite
.content .iconfont
  display: inline-block
  font-size: 15px
// END 图标

// START 动态表单
// 各大小按钮和表单控件的icon
.btn-lg .iconfont, .input-group-lg .iconfont
  font-size: 18px
.btn-md .iconfont, .input-group-md .iconfont
  font-size: 16px
.btn-sm .iconfont, .input-group-sm .iconfont
  font-size: 14px
.btn-xs .iconfont
  font-size: 12px
.el-tree-node__content > .el-checkbox
  vertical-align: inherit
.el-checkbox__inner
  // 兼容2.0的样式调整
  margin-top: 9px
  position: inherit
  z-index: inherit
.el-checkbox__label
  vertical-align: bottom
.el-checkbox-group
  line-height: 37px
// 各大小表单控件的label
.col-form-label-lg
  line-height: 36px
.col-form-label-md
  line-height: 24px
.col-form-label-sm
  line-height: 28px
// 各大小select,基于multiselect

.multiselect, .multiselect__input, .multiselect__single
  font-size: 14px
.multiselect__tags
  border-radius: 4px
.multiselect__single
  min-height: 14px
  white-space: nowrap
  overflow: hidden
.has-error
  .multiselect__tags
    border-color: #f55753
.input-group-lg
  .multiselect
    min-height: 48px
  .multiselect__select
    height: 30px
    top: 8px
  .multiselect__tags
    padding-top: 11px
    min-height: 48px
  .multiselect__input, .multiselect__single
    font-size: 16px
.input-group-md
  .multiselect
    min-height: 36px
  .multiselect__select
    height: 30px
    top: 4px
  .multiselect__tags
    padding-top: 7px
    min-height: 36px
  .multiselect__input, .multiselect__single
    margin-bottom: 6px
  .multiselect__option
    padding: 10px
    min-height: 36px
.input-group-sm
  .multiselect
    min-height: 32px
  .multiselect__select
    height: 30px
  .multiselect__tags
    padding-top: 5px
    min-height: 32px
  .multiselect__input, .multiselect__single
    margin-bottom: 4px
  .multiselect__option
    padding: 8px
    min-height: 32px
.input-group .multiselect
  &:not(:first-child)
    .multiselect__tags
      border-top-left-radius: 0
      border-bottom-left-radius: 0
  &:not(:last-child)
    .multiselect__tags
      border-top-right-radius: 0
      border-bottom-right-radius: 0
// END 动态表单

// START Loading
.loadpage
  display: block
  position: fixed
  z-index: 99999
  top: 0
  bottom: 0
  left: 0
  right: 0
  background: #6dc0f9
.loadpage .loader
  transform: translateZ(0)
  font-size: 24px
  width: 1.2em
  height: 1.2em
  border-radius: 50%
  position: absolute
  top: 50%
  left: 50%
  margin: -1em 0 0 -1em
  animation: loader 1.1s infinite ease
@keyframes loader
  0%, 100%
    box-shadow: 0em -2.6em 0em 0em #ffffff, 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.5), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.7)
  12.5%
    box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.7), 1.8em -1.8em 0 0em #ffffff, 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.5)
  25%
    box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.5), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.7), 2.5em 0em 0 0em #ffffff, 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2)
  37.5%
    box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.5), 2.5em 0em 0 0em rgba(255, 255, 255, 0.7), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2)
  50%
    box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.5), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.7), 0em 2.5em 0 0em #ffffff, -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2)
  62.5%
    box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.5), 0em 2.5em 0 0em rgba(255, 255, 255, 0.7), -1.8em 1.8em 0 0em #ffffff, -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2)
  75%
    box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.5), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.7), -2.6em 0em 0 0em #ffffff, -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2)
  87.5%
    box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.5), -2.6em 0em 0 0em rgba(255, 255, 255, 0.7), -1.8em -1.8em 0 0em #ffffff

.loading-wrapper
  position: relative
  padding: 20px
.loading
  transform: translateZ(0)
  font-size: 1px
  width: 5px!important
  height: 5px!important
  border-radius: 50%
  position: absolute
  top: 50%
  left: 50%
  margin: -2px 0 0 -2px
  animation: loading 1.1s infinite ease
@keyframes loading
  0%, 100%
    box-shadow: 0em -8px 0em 0em #000, 6px -6px 0 0em rgba(0, 0, 0, 0.2), 8px 0em 0 0em rgba(0, 0, 0, 0.2), 6px 6px 0 0em rgba(0, 0, 0, 0.2), 0em 8px 0 0em rgba(0, 0, 0, 0.2), -6px 6px 0 0em rgba(0, 0, 0, 0.2), -8px 0em 0 0em rgba(0, 0, 0, 0.5), -6px -6px 0 0em rgba(0, 0, 0, 0.7)
  12.5%
    box-shadow: 0em -8px 0em 0em rgba(0, 0, 0, 0.7), 6px -6px 0 0em #000, 8px 0em 0 0em rgba(0, 0, 0, 0.2), 6px 6px 0 0em rgba(0, 0, 0, 0.2), 0em 8px 0 0em rgba(0, 0, 0, 0.2), -6px 6px 0 0em rgba(0, 0, 0, 0.2), -8px 0em 0 0em rgba(0, 0, 0, 0.2), -6px -6px 0 0em rgba(0, 0, 0, 0.5)
  25%
    box-shadow: 0em -8px 0em 0em rgba(0, 0, 0, 0.5), 6px -6px 0 0em rgba(0, 0, 0, 0.7), 8px 0em 0 0em #000, 6px 6px 0 0em rgba(0, 0, 0, 0.2), 0em 8px 0 0em rgba(0, 0, 0, 0.2), -6px 6px 0 0em rgba(0, 0, 0, 0.2), -8px 0em 0 0em rgba(0, 0, 0, 0.2), -6px -6px 0 0em rgba(0, 0, 0, 0.2)
  37.5%
    box-shadow: 0em -8px 0em 0em rgba(0, 0, 0, 0.2), 6px -6px 0 0em rgba(0, 0, 0, 0.5), 8px 0em 0 0em rgba(0, 0, 0, 0.7), 6px 6px 0 0em rgba(0, 0, 0, 0.2), 0em 8px 0 0em rgba(0, 0, 0, 0.2), -6px 6px 0 0em rgba(0, 0, 0, 0.2), -8px 0em 0 0em rgba(0, 0, 0, 0.2), -6px -6px 0 0em rgba(0, 0, 0, 0.2)
  50%
    box-shadow: 0em -8px 0em 0em rgba(0, 0, 0, 0.2), 6px -6px 0 0em rgba(0, 0, 0, 0.2), 8px 0em 0 0em rgba(0, 0, 0, 0.5), 6px 6px 0 0em rgba(0, 0, 0, 0.7), 0em 8px 0 0em #000, -6px 6px 0 0em rgba(0, 0, 0, 0.2), -8px 0em 0 0em rgba(0, 0, 0, 0.2), -6px -6px 0 0em rgba(0, 0, 0, 0.2)
  62.5%
    box-shadow: 0em -8px 0em 0em rgba(0, 0, 0, 0.2), 6px -6px 0 0em rgba(0, 0, 0, 0.2), 8px 0em 0 0em rgba(0, 0, 0, 0.2), 6px 6px 0 0em rgba(0, 0, 0, 0.5), 0em 8px 0 0em rgba(0, 0, 0, 0.7), -6px 6px 0 0em #000, -8px 0em 0 0em rgba(0, 0, 0, 0.2), -6px -6px 0 0em rgba(0, 0, 0, 0.2)
  75%
    box-shadow: 0em -8px 0em 0em rgba(0, 0, 0, 0.2), 6px -6px 0 0em rgba(0, 0, 0, 0.2), 8px 0em 0 0em rgba(0, 0, 0, 0.2), 6px 6px 0 0em rgba(0, 0, 0, 0.2), 0em 8px 0 0em rgba(0, 0, 0, 0.5), -6px 6px 0 0em rgba(0, 0, 0, 0.7), -8px 0em 0 0em #000, -6px -6px 0 0em rgba(0, 0, 0, 0.2)
  87.5%
    box-shadow: 0em -8px 0em 0em rgba(0, 0, 0, 0.2), 6px -6px 0 0em rgba(0, 0, 0, 0.2), 8px 0em 0 0em rgba(0, 0, 0, 0.2), 6px 6px 0 0em rgba(0, 0, 0, 0.2), 0em 8px 0 0em rgba(0, 0, 0, 0.2), -6px 6px 0 0em rgba(0, 0, 0, 0.5), -8px 0em 0 0em rgba(0, 0, 0, 0.7), -6px -6px 0 0em #000
// END Loading

// START table-sort
.table-caption-sort,.table-caption-sort-desc,.table-caption-sort-asc
  display: inline-block
  width: 8px
  height: 16px
  background-repeat: no-repeat
  background-position: center center
.table-caption-sort
  background-image: url(../img/icon-sort.png)
.table-caption-sort-desc
  background-image: url(../img/icon-sort-desc.png)
.table-caption-sort-asc
  background-image: url(../img/icon-sort-asc.png)
// END table-sort

// START scrollbar css
.iScrollIndicator
  border: 0!important
  background: #404852 !important
// ENd scrollbar css

.vue-lb-container
  z-index: 9999 !important

// 下拉框样式修改(start)

// 主题色
$hover-info: #eaeff3
$info: #03a9f4
$selected: #03a9f4

// .multiselect
// .multiselect:hover
//   .multiselect__clear
//     display: inline
.multiselect__select
  position: absolute
  width: 22px
  right: 1px
  top: 1px
  padding: 4px 0
  text-align: center
  transition: transform .2s ease
  &:hover + .multiselect__clear
      display: inline-block
.multiselect-label
  float: left

.multiselect-subtext
  float: right
  color: rgb(132, 146, 166)
  font-size: 13px

.multiselect__spinner
  background: #fff

.multiselect__spinner:before,
.multiselect__spinner:after
  border-color: $hover-info trnsparent transparent

.multiselect
  min-width: 84px
  color: rgb(53, 73, 94)

.multiselect__input,
.multiselect__single
  background: #fff

.multiselect__input:hover,
.multiselect__single:hover
  border-color: #cfcfcf

.multiselect__input:focus,
.multiselect__single:focus
  border-color: #a8a8a8

.multiselect__tags
  border: 1px solid #E8E8E8
  background: #fff

.multiselect__tag
  color: #fff
  background: $info

.multiselect__tag-icon:after
  color: #cfcfcf

.multiselect__tag-icon:focus,
.multiselect__tag-icon:hover
  background: $info

.multiselect__tag-icon:focus:after,
.multiselect__tag-icon:hover:after
  // color: rgb(53, 73, 94)
  color: #fff

.multiselect__current
  border: 1px solid #E8E8E8

.multiselect__select:before
  color: #999
  border-color: #999999 transparent transparent transparent

.multiselect__placeholder
  color: #ADADAD

.multiselect__content-wrapper
  background: #fff
  border: 1px solid #E8E8E8

.multiselect--above .multiselect__content-wrapper
  border-top: 1px solid #E8E8E8


.multiselect__option--highlight
  background: $hover-info
  color: rgb(53, 73, 94)

.multiselect__option--highlight:after
  background: $hover-info
  color: rgb(53, 73, 94)

.multiselect__option--selected
  background: $selected
  color: #fff

.multiselect__option--selected:after
  color: silver

.multiselect__option--selected.multiselect__option--highlight
  background: $selected
  color: #fff

.multiselect__option--selected.multiselect__option--highlight:after
  background: $selected
  color: #fff

.multiselect--disabled
  background: #ededed

.multiselect--disabled .multiselect__current,
.multiselect--disabled .multiselect__select
  background: #ededed
  color: #a6a6a6

.multiselect__option--disabled
  background: #ededed
  color: #a6a6a6

.multiselect__option--disabled.multiselect__option--highlight
  background: #dedede !important

.multiselect__clear
  position: absolute
  right: 1px
  top: 1px
  height: 34px
  width: 24px
  display: block
  cursor: pointer
  z-index: 2
  text-align: center
  line-height: 34px
  display: none
  background: #fff
  &:hover
    display: block
  .icon-close
// 下拉框样式修改(end)

// smartForm--style start
// 数字框样式
.el-input-number
  z-index: 0
  min-width: 150px
  .el-input-number__decrease,
  .el-input-number__increase
    z-index: 1

// 时间范围样式
.el-date-editor--daterange.el-input,
.el-date-editor--daterange.el-input__inner,
.el-date-editor--timerange.el-input,
.el-date-editor--timerange.el-input__inner
  width: 238px
.el-date-editor .el-range-input
  max-width: 80px
.el-date-editor .el-range__close-icon
  float: none

// 开关样式修改
.el-switch, .el-tree-node__content>.el-checkbox
  margin-top: 7px
// smartForm--style end

// 弹窗样式修改
// 主题色
.swal2-modal
  .btn
    cursor: pointer
    font-size: 17px
    font-weight: 500
    margin: 15px 5px 0
    padding: 10px 32px

// row 柵格 START
$_row-Height: 40px !default // 单个row高度
$_gutter: 20px !default     // 间距
@mixin get_row_height ($rowCount: 1)
  height: 60px * $rowCount - 20px
  // line-height: 40px
  margin-bottom: 20px
  width: 100%

.rows-1
  @include get_row_height(1)
.rows-2
  @include get_row_height(2)
.rows-3
  @include get_row_height(3)
.rows-4
  @include get_row_height(4)
.rows-5
  @include get_row_height(5)
.rows-6
  @include get_row_height(6)
.rows-7
  @include get_row_height(7)
.rows-8
  @include get_row_height(8)
.rows-9
  @include get_row_height(9)
.rows-10
  @include get_row_height(10)
.rows-11
  @include get_row_height(11)
.rows-12
  @include get_row_height(12)

// row 柵格 END

// tab样式
.main-tabs
  .el-tabs__content
    flex: 1!important
    height: 100%
.top-menutasks
  .el-tabs__nav
    width: 100%

// sweetlaert 的按钮样式修改
.btn-success:not([disabled]):not(.disabled).active, .btn-success:not([disabled]):not(.disabled):active, .show>.btn-success.dropdown-toggle
  background-color: #10cfbd
  border-color: #10cfbd
  box-shadow: 0 0 0 0.2rem rgba(16,207,189,.5)
.btn-danger:not([disabled]):not(.disabled).active, .btn-danger:not([disabled]):not(.disabled):active, .show>.btn-danger.dropdown-toggle
  background-color: #f55753
  border-color: #f55753
  box-shadow: 0 0 0 0.2rem rgba(245,87,83,.5)

@font-face
  font-family: "fontnumber"
  src: url('fontnumber.ttf') format('truetype')
